<template>
  <div class="background">
    <div class="box">
      <div class="box-top">
        <router-link to="/enter/login"><h3>登录</h3></router-link>
        <router-link to="/enter/register"><h3>注册</h3></router-link>
      </div>
      <router-view></router-view>
    </div>
  </div>
</template>

<script>
export default {
  name:'Enter'
}
</script>

<style scoped>
  .background{
    width: 100vw;
    height: 100vh;
    background-image: url(../../../assets/img/background.jpg);
  }
  .box{
    width: 400px;
    height: 500px;
    background-color: rgb(192, 197, 197,.7);
    border-radius:10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 1px 2px 5px #eee;
  }
  .box-top{
    width: 400px;
    height: 60px;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #eee;
  }
  h3{
    width:200px;
    height: 60px;
    text-align: center;
    padding-top:10px ;
  }
</style>